<template>
  <f-table ref="tableRef" @register="register">
    <template #header-left>
        <el-button @click="handleExport">{{ t('export') }}</el-button>
    </template>
  </f-table>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { t } from '@/lang'
import { useRouter } from 'vue-router'
import FTable, { BasicColumn, useTable } from '@/addon/htscrm/components/f-table'
import { tableColumns, tableSearchFormItems } from '@/addon/htscrm/data/activity.video.store-data'
import { getStoreAnalysisDataApi } from '@/addon/htscrm/api'
import {
  exportDataApi
} from "@/addon/htscrm/api";
import { ElMessageBox } from "element-plus";

const router = useRouter();

const prop = defineProps({
    searchForm: {
        type: Object,
        default: () => ({})
    }
})
const tableRef = ref()
const { methods, register } = useTable({
    rowKey: 'id',
    searchFromItems: tableSearchFormItems(t),
    columns: tableColumns(t) as BasicColumn<any>[],
    beforeFetch: (opt) => {
        return { ...opt, ...prop.searchForm }
    },
    api: async (opt) => (await getStoreAnalysisDataApi(opt)).data
})

function reload () {
    methods.reload()
}

/**
 * @description 导出
 */
async function handleExport() {
  let params = methods.getSearchInfo()
  const res = await exportDataApi("storeStatistics", {
    ...params,
    ...prop.searchForm
  });
  if (res.data) {
    const action = await ElMessageBox.confirm(
      "文件导出已添加到下载中心，是否立即前往下载中心",
      t("alert.title"),
      {
        cancelButtonText: "我再看看",
        confirmButtonText: "立即前往",
      }
    );
    console.log(action);

    if (action === "confirm") {
      router.push("/htscrm/system/download");
    }
  }
}

defineExpose({
    reload
})
</script>

<style lang="scss" scoped>
:deep(.f-search) {
    background-color: var(--el-bg-color-page);
}
</style>
